<template>
  <div class="setting-container">
    <div class="app-container" >
            <el-card>
        <el-tabs>
          <!-- <el-button type="primary" icon="el-icon-plus" @click="showEdit=true">新建</el-button> -->
        
      <el-table :data="list" class="mt-20" >
        <el-table-column prop="id" label="序号"/>
        <el-table-column prop="userId" label="用户id" />
        <el-table-column prop="money" label="充值方式" />
        <el-table-column prop="money" label="充值金额" />
        <el-table-column prop="screenShot" label="截图" />
        <el-table-column prop="stateName" label="状态" />
        <el-table-column prop="id" label="充值订单号" width="100" />
        <el-table-column prop="way" label="微信订单号" width="100" />
        <el-table-column prop="createTime" width="250" label="创建时间" />
        <el-table-column prop="text" fixed="right"  label="操作" width="200">
          <template slot-scope="scope">
            <el-button type="primary" @click="pass(scope.row)" v-if="scope.row.state==1">通过</el-button>
            <el-button type="danger" @click="reject(scope.row)"  v-if="scope.row.state==1">驳回</el-button>
          </template>
        </el-table-column>
      </el-table>
      </el-tabs>
      </el-card>
    </div>
    <!-- 分页 -->
    <!-- <div align="center">
      <el-pagination
        :current-page.sync="currentPage"
        layout="prev, pager, next, jumper"
        :total="total"
        :page-size="pageSize"
      />
    </div> -->
    <!-- 确认框 -->
    <el-dialog title="提示" :visible.sync="deleteVisible" width="30%">
      <span>确定{{type==0?'驳回':'通过'}}id为{{formData.id}}的申请吗？</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="deleteVisible = false">取 消</el-button>
        <el-button type="primary" @click="comfirm">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {selectRecharge,recharge,screenShot} from "@/api/qiniu";
export default {
  data() {
    return {
      list: [],
      currentPage: 1,
      total: 0,
      pageSize: 10,
      formData: {},
      showEdit: false,
      deleteVisible: false,
      typeName:['失败','待审核','成功','已使用'],
      type: 0 // 0 驳回，2 通过
    };
  },
  mounted() {
    this.getList()
  },
  methods: {
    async getList(){
      let res = await selectRecharge()
      res.map((item)=>{
        item.stateName=['失败','待审核','成功','已使用'][item.state]
        return item
      })
      this.list = res
    },
    handleEdit(row) {
      this.formData = row;
      this.showEdit = true;
    },
    closeDialog() {},
    editSubmit() {
      if (this.formData.id) {
        //编辑
      } else {
        //删除
      }
      this.$message.success('操作成功')
      this.showEdit=false
      this.getList()
    },
    handleDelete(row) {
      this.deleteRow = row
      this.deleteVisible = true
    },
    async deleteComfirm(){
      const res = await deleteSWL({
        id: this.deleteRow.id
      })
      this.$message.success(res)
      this.deleteVisible=false
      this.getList();
    },
    async pass(row){
      this.formData = row;
      this.type=2
      this.deleteVisible = true
      
    },
    reject(row){
      this.formData = row;
      this.type=0
      this.deleteVisible = true
    },
    async recharge(row){
      const res = await recharge({
        id: row.id
      })
      this.$message.success(res)
    },
    async comfirm(){
      const res = await screenShot({
        id:this.formData.id,
        state:this.type
      })
      this.deleteVisible=false
      this.$message.success(res)
      this.getList()
    }
  }
};
</script>